//
//  HTFeedbackView.swift
//  MagaCore
//
//  Created by 谢 on 2024/8/22.
//

import SwiftUI

struct HTFeedbackView: View {
    
    @State var var_describeStr = ""
    @State var var_emailStr = ""
    @State var var_canSubmit = false
    
    var body: some View {
        HTNavigationBar {
            ScrollView(showsIndicators: false) {
                VStack(spacing: 0) {
                    VStack(spacing: 0) {
                        HStack(spacing: 0) {
                            Text("Describe The Problem")
                                .font(.system(size: 14, weight: .heavy))
                                .foregroundStyle(Color(hex: "#393939"))
                            
                            Spacer()
                        }
                        .padding(.horizontal, 14)
                        .padding(.top, 16)
                        
                        ZStack(alignment: .topLeading) {
                            TextEditor(text: $var_describeStr)
                                .foregroundStyle(Color(hex: "#393939"))
                                .font(.system(size: 12, weight: .regular))
                                .frame(height: 140)
                                .padding(.horizontal, 10)
                                .padding(.top, -2)
                                .onChange(of: var_describeStr) { newValue in
                                    if var_emailStr.isEmpty || var_describeStr.isEmpty {
                                        var_canSubmit = false
                                    }else{
                                        var_canSubmit = true
                                    }
                                }
                            
                            if var_describeStr.isEmpty {
                                Text("Please describe your issue or suggestion in detail.")
                                    .font(.system(size: 12, weight: .regular))
                                    .foregroundColor(Color(hex: "#999999"))
                                    .padding(.horizontal, 14)
                                    .padding(.top, 6)
                            }
                        }
                        .padding(.bottom, 16)
                    }
                    .background(.white)
                    .padding(.top, 10)
                    
                    VStack(spacing: 0) {
                        HStack(spacing: 0) {
                            Text("Email Address")
                                .font(.system(size: 14, weight: .heavy))
                                .foregroundStyle(Color(hex: "#393939"))
                            
                            Spacer()
                        }
                        .padding(.horizontal, 14)
                        .padding(.top, 16)
                        
                        ZStack(alignment: .topLeading) {
                            TextEditor(text: $var_emailStr)
                                .foregroundStyle(Color(hex: "#393939"))
                                .font(.system(size: 12, weight: .regular))
                                .frame(height: 60)
                                .padding(.horizontal, 10)
                                .padding(.top, -2)
                                .onChange(of: var_emailStr) { newValue in
                                    if var_emailStr.isEmpty || var_describeStr.isEmpty {
                                        var_canSubmit = false
                                    }else{
                                        var_canSubmit = true
                                    }
                                }
                            
                            if var_emailStr.isEmpty {
                                Text("Please enter a proper valid email address.")
                                    .font(.system(size: 12, weight: .regular))
                                    .foregroundColor(Color(hex: "#999999"))
                                    .padding(.horizontal, 14)
                                    .padding(.top, 6)
                            }
                        }
                        .padding(.bottom, 16)
                    }
                    .background(.white)
                    .padding(.top, 10)
                    
                    Text("Submit")
                        .font(.system(size: 14, weight: .heavy))
                        .foregroundStyle(var_canSubmit ? Color.white : Color(hex: "#999999"))
                        .frame(width: 200 ,height: 36)
                        .background(var_canSubmit ? LinearGradient(gradient: Gradient(colors: [Color(hex: "FF6D1C"), Color(hex: "FF1C1C")]), startPoint: .leading, endPoint: .trailing) : LinearGradient(gradient: Gradient(colors: [Color.black.opacity(0.04)]), startPoint: .leading, endPoint: .trailing))
                        .clipShape(RoundedRectangle(cornerRadius: 36/2.0))
                        .padding(.top, 50)
                        .onTapGesture {
                            if var_canSubmit {
                                print("反馈")
                            }
                        }
                    
                    Text(AttributedString("Or you can contact us at: wizmock@outlook.com"))
                        .font(.system(size: 12, weight: .regular))
                        .foregroundStyle(Color(hex: "#999999"))
                        .padding(.top, 24)
                }
            }
        }
        .ht_title(title: "Feedback")
        .ht_maxWidth(leading: 80, trailing: 80)
        .background(content: {
            Color(hex: "#F8F8F8")
        })

    }
}

#Preview {
    HTFeedbackView()
}
